﻿@model Contacts.Models.Contact
@{
  ViewBag.Title = "Edit";
  Layout = "~/Views/Shared/_Layout.cshtml";
  var i = 0;
}
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
<script src="https://github.com/jquery/jquery-datalink/raw/master/jquery.datalink.js"
  type="text/javascript"></script>
<script type="text/javascript">
  $(function () {

    var ContactId = $('#ContactId').val();

    $('.newemail').click(function () {
      $("#emailTmpl").tmpl({ number: $('.entry').length, ContactId: ContactId }).appendTo("#emails");
    });

    $('.newphone').click(function () {
      $("#phonetmpl").tmpl({ number: $('.entry').length, ContactId: ContactId }).appendTo("#phones");
    });

    $('.remove').live('click', function () {
      $(this).parent().empty();
    });

  });
</script>
<script id="phonetmpl" type="text/x-jquery-tmpl">
		<div class="entry">
      <input type="hidden" name="ContactInformations.Index" value="${number}" />
      <input type="hidden" name="ContactInformations[${number}].ContactId" value="${ContactId}" />
      <input type="hidden" name="ContactInformations[${number}].ContactInformationId" value="0" />
      <select name="ContactInformations[${number}].ContactTypeId">
        <option value="1">Office</option>
        <option value="2">Home</option>
        <option value="3">Mobile</option>
      </select>
			<input class="phone phone-number" name="ContactInformations[${number}].Information" type="text" value="${Information}" />
			<a href="#" class="phone-remove">remove</a>
		</div>
</script>
<script id="emailTmpl" type="text/x-jquery-tmpl">
		<div class="entry">
      <input type="hidden" name="ContactInformations.Index" value="${number}" />
      <input type="hidden" name="ContactInformations[${number}].ContactId" value="${ContactId}" />
      <input type="hidden" name="ContactInformations[${number}].ContactInformationId" value="0" />
      <select name="ContactInformations[${number}].ContactTypeId">
        <option value="4">Business</option>
      </select>
			<input class="email" name="ContactInformations[${number}].Information" type="text" value="${Information}" />
			<a href="#" class="remove">remove</a>
		</div>
</script>
<h2>
  Edit</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm()) {
  @Html.ValidationSummary(true)
  <div class="contact">
    @Html.HiddenFor(model => model.ContactId)
    <div class="editor-label">
      @Html.LabelFor(model => model.Firstname)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.Firstname)
      @Html.ValidationMessageFor(model => model.Firstname)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.Lastname)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.Lastname)
      @Html.ValidationMessageFor(model => model.Lastname)
    </div>
    <h3>
      Contact Information</h3>
    <h4>
      Phones&nbsp;<a href="#" class="newphone">Add</a></h4>
    <div id="phones">
      @foreach (var info in Model.ContactInformations.Where(c => c.ContactTypeId <= 3)) {
        <div class="entry">
          <input type="hidden" name="ContactInformations.Index" value="@i.ToString()" />
          <input type="hidden" name="@string.Format("ContactInformations[{0}].ContactId", i)" value="@info.ContactId" />
          <input type="hidden" name="@string.Format("ContactInformations[{0}].ContactInformationId", i)" value="@info.ContactInformationId" />
          @Html.DropDownList(string.Format("ContactInformations[{0}].ContactTypeId", i), Contacts.Views.Helpers.SelectHelpers.GetPhoneTypes(info.ContactTypeId.ToString()))
          @Html.TextBox(string.Format("ContactInformations[{0}].Information", i), info.Information)
          @Html.ValidationMessage(string.Format("ContactInformations[{0}].Information", i), info.Information)
          <a href="#" class="remove">remove</a>
        </div>
        i++;
      }
    </div>
    <h4>
      Emails&nbsp;<a href="#" class="newemail">Add</a></h4>
    <div id="emails">
      @foreach (var info in Model.ContactInformations.Where(c => c.ContactTypeId == 4)) {
        <div class="entry">
          <input type="hidden" name="ContactInformations.Index" value="@i.ToString()" />
          <input type="hidden" name="@string.Format("ContactInformations[{0}].ContactId", i)" value="@info.ContactId" />
          <input type="hidden" name="@string.Format("ContactInformations[{0}].ContactInformationId", i)" value="@info.ContactInformationId" />
          @Html.DropDownList(string.Format("ContactInformations[{0}].ContactTypeId", i), Contacts.Views.Helpers.SelectHelpers.GetEmailTypes(info.ContactTypeId.ToString()))
          @Html.TextBox(string.Format("ContactInformations[{0}].Information", i), info.Information)
          @Html.ValidationMessage(string.Format("ContactInformations[{0}].Information", i), info.Information)
          <a href="#" class="remove">remove</a>
        </div>
        i++;
      }
    </div>
    <p>
      <input type="submit" value="Save" class="save" />
    </p>
  </div>
}
<div>
  @Html.ActionLink("Back to List", "Index")
</div>
